$(function () {
    // 默认加载部门树
    vm.getDept();
});

var ztree;
//部门树
var deptSetting = {
    data: {
        simpleData: {
            enable: true,
            idKey: "deptId",
            pIdKey: "parentId",
            rootPId: '01'
        },
        key: {
            url: "nourl",
            name: "name" //name 与 typeName 绑定
        },
    },
    callback: {
        beforeCheck: true,
        beforeClick: outTreeCheck
    }
};

function outTreeCheck(e, treeObj, treeNode) {
    vm.q.deptId = treeObj.deptId;
    vm.search();
}

var myChart;
var vm = new Vue({
    el: '#rrapp',
    data: {
        colors: ['#5470C6', '#91CC75', '#EE6666'],
        q:{
            month:'', // 当前月份
            deptId:'0111' // 当前组织
        },
        option : {
            title: {
                text: '维修工作量统计',
                left: 'center',
                padding: 10
            },
            tooltip: {
                trigger: 'axis',
                axisPointer: {
                    type: 'shadow'
                },
                formatter:'{b}<br />累计维修时长 : {c}分钟<br />累计维护时长 : {c1}分钟'
            },
            toolbox: {
                show: true,
                feature: {
                    magicType: {show: true, type: ['line','bar']},
                    dataView: {show: true, readOnly: false},
                    saveAsImage: {show: true}
                },
                trigger: 'item',
                axisPointer: {            // 坐标轴指示器，坐标轴触发有效
                    type: 'shadow'        // 默认为直线，可选为：'line' | 'shadow'
                },
                formatter: function (params) {
                    var tar = params[1];
                    return tar.name + '<br/>' + tar.seriesName + ' : ' + tar.value;
                }
            },
            xAxis: [
                {
                    type: 'category',
                    data:  [],
                    axisLabel: {
                        interval:0,
                        rotate:-45
                    }
                }
            ],
            yAxis:{
                type: 'value',
                name: '维修时长'
            },
            series: [
                {
                    name: '维修时长',
                    type: 'bar',
                    stack:'ad',
                    barWidth: 20,
                    data: [120, 200, 150],
                    label:{
                        show:true,
                    },
                    itemStyle:{
                        color:'#4472c4'
                    }
                },
                {
                    name: '维护时长',
                    type: 'bar',
                    stack:'ad',
                    barWidth: 20,
                    data: [120, 200, 150],
                    label:{
                        show:true,
                    },
                    itemStyle:{
                        color:'#ed7d31'
                    },
                    markLine:{
                        data:[
                            {
                                type:'average',
                                name:'平均线'
                            }
                        ],
                        lineStyle:{
                            color:'#fa0202'
                        }
                    }
                }
            ]
        }
    },
    methods: {
        getDept: function () {
            //加载部门树
            Ajax.request({
                url: '../sys/user/listPersonOrganTree?level=4',
                async: false,
                successCallback: function (r) {
                    ztree = $.fn.zTree.init($("#deptTree"), deptSetting, r.list);
                    var node = ztree.getNodeByParam("deptId", '0111');
                    if (node) {
                        vm.q.curDeptId = node.deptId;
                        ztree.selectNode(node);
                        ztree.expandNode(node);
                    }else{
                        ztree.expandAll(true);
                    }
                }
            });
        },
        search: function () {
            var param = {};
            if(this.q.month){
                param.month = this.convertGMT2Month(this.q.month);
            }
            if(this.q.deptId){
                param.deptId = this.q.deptId;
            }
            myChart.showLoading();
            Ajax.request({
                url: "../device/stat/repairWork",
                type: 'POST',
                params: JSON.stringify(param),
                contentType: 'application/json',
                successCallback: function (res) {
                    myChart.hideLoading();
                    myChart.setOption({
                        xAxis: {
                            data: res.result.xaxisData
                        },
                        series:[
                            {
                                data: res.result.barSeriesData[0].data
                            },
                            {
                                data: res.result.barSeriesData[1].data
                            }
                        ]
                    });
                }
            });
        },
        resetSearch: function () {
            vm.q.month = '';
            vm.q.deptId = '';
            vm.search();
        },
        convertGMT2Month: function(time){
            var date = new Date(time)
            var month = (date.getMonth() + 1);
            return date.getFullYear() + '-' + (month < 10? '0':'') + month;
        }
    },
    mounted: function(){
        // 初始化
        myChart = echarts.init(document.getElementById("container"));
        myChart.setOption(this.option,true);
        this.search();
    }
});
